﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Smart Pagination</title>
    <script src="jquery-1.4.4.min.js" type="text/javascript"></script>
    <script src="smartpaginator.js" type="text/javascript"></script>
    <link href="smartpaginator.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
        $(document).ready(function () {
            $('#red').smartpaginator({ 
                totalrecords: 100, 
                recordsperpage: 10, 
                length: 9, 
                next: 'Next', 
                prev: 'Prev', 
                first: 'First', 
                last: 'Last', 
                theme: 'black', 
                controlsalways: true, 
                onchange: function (newPage) {
                	$('#r').html('Page # ' + newPage);
           		}
           	});
        });
    </script>
</head>
<body>
    <div id="wrapper">
        <div id="red-contents" class="contents" style="border: solid 1px #F82723;">
            <div style="height: 65px; text-align: center; font-size: 2em; padding-top: 40px;
                color: #F82723" id="r">
                Page # 1
            </div>
            <div id="red" style="margin: auto;">
            </div>
        </div>
    </div>
</body>
</html>
